<template>
  <el-aside width="200px" class="aside">
    <el-menu
      :default-active="route.path"
      exact
      class="el-menu-vertical-demo"
      router
    >
      <el-menu-item class="menu" index="/index" style="padding: 0px;">
        <div
          style="
            width: 60%;
            height: 20%;
            padding-left: 10px;
            margin-bottom: 60px;
          "
        >
          <el-image id="myImage" :src="zhaoxiImage" />
        </div>
      </el-menu-item>
      <NavItem
        v-for="v in treelist"
        :key="v.webUrl"
        :item="v"
        :basePath="v.webUrl"
      />
    </el-menu>
  </el-aside>
</template>

<script setup>
import { ref, reactive, computed } from "vue";
import { useRouter, useRoute } from "vue-router"; //导入路由
import NavItem from "./navItem.vue"; //子组件
import {
  House,
  Grid,
  Management,
  List,
  UserFilled,
  Checked,
  Ticket,
  Avatar,
  Picture,
} from "@element-plus/icons-vue";
import axios from "@/api";
import mainStore from "@/store/index";
import zhaoxiImage from "../../assets/img/zhaoxilogo.png";

const router = useRouter();
const route = useRoute();
const treelist = computed(() => mainStore().$state.menulist);
</script>